<br /><br />
<script type="text/javascript">

    var subscribed = <?php echo ($this->subscribed) ? "true" : "false"; ?>;
<?php if ($this->isOwner) { ?>
    function showGroupEditForm() {
        var desc = $("#gdescr");

        $("#descarea").html(desc.html());
        $("#gdescr").hide();
        $("#groupEdit").fadeIn();
        return false;
    }

    function submitEditForm() {
        $.post('<?php echo $this->url(array("id" => $this->group->id()), "groupedit", true); ?>',
            $("#groupEdit").serialize(), function(data) {
                $("#groupEdit").hide();
                $("#gdescr").html(data.description);
                $("#gdescr").show();
            });
        return false;
    }

<?php } ?>
    function triggerSubscribe() {
        if (subscribed) {
            $.post('<?php echo $this->url(array("id" => $this->group->id()), "unsubscribe", true); ?>',
                null, function(data) {
                    subscribed = data.subscribed;
                    $("#subscription").html("Subscribe");
                });
        } else {
            $.post('<?php echo $this->url(array("id" => $this->group->id()), "subscribe", true); ?>',
                null, function(data) {
                    subscribed = data.subscribed;
                    $("#subscription").html("Unsubscribe");
                });
        }
        return false;
    }

        function fixImgSize(img) {
        var src = img.attr('src');
        var temp = new Image();
        temp.src = src;
        temp.onload = function(){
            if (temp.width < img.width()) {
                img.attr('width', temp.width);
            }
        };
        
    }

    $(document).ready(function() {
<?php if ($this->isOwner) { ?>
        $("#groupEdit").hide();
        $("#gdescr").click(showGroupEditForm);
        $("#editSubmitButton").click(submitEditForm);
<?php } ?>
        $("#subscription").click(triggerSubscribe);
        $("#new_comment").val("#g<?php echo $this->group->id(); ?>:");
        
        fixImgSize($('#preview'))
    });
</script>
<div id="view-content">
	<?php if ($this->error) { ?>
    <p class="error"><?php echo $this->error; ?></p>
    <?php } else { ?>
    <div id="group_carac">
    <h2>Group : <?php echo $this->group->name(); ?><img width="200px" id="preview" src="<?php echo $this->group->get_image_uri(); ?>" alt="<?php echo $this->group->name(); ?>"
         /></h2>
    <?php 
    if ($this->isOwner) {
        $editFormUrl = $this->url(array("id" => $this->group->id()), "groupedit", true); ?>
    <form id="groupEdit" method="post" action="#" style="display: none;">
        <textarea name="description" id="descarea" cols="40" rows="5"></textarea>
        <input type="submit" name="Modify" id="editSubmitButton"/>
    </form>
    <?php } ?>
    <p id="gdescr"><?php echo $this->group->description(); ?></p>
    <a id="subscription" href="#"><?php if ($this->subscribed) { echo "Unsubscribe"; } else { echo "Subscribe"; } ?></a>
    <div class="clear">&nbsp;</div>
    </div>
    <div id="element_list">
    <h2>Element list :</h2>
    <ul id="listElements">
    <?php
        if ($this->elements) {
            foreach ($this->elements as $elem) {
                echo "<li>";
                echo "<a href=\"" . $this->url(array("id" => $elem->id()), "viewelement", true) . "\">";
                echo "<img alt=\"" . $elem->name() . "\" src=\"". $elem->get_image_uri() . "\" width=\"100\">";
                echo "</a></li>";
            }
        }
    } ?>
    </ul>
    </div>
    <?php echo $this->action("groupcomments", "social", null, array("id" => $this->group->id())); ?>
</div>